import { homeData } from './_localData.js';
import { AjaxRequest } from '../utils/request.js';
import { HomeRenderFn } from '../utils/render.js';
import { initEvent } from '../utils/init.js';

// 所有轮播图分组
let carouselGroupAll = [];
// 回想人物志下的所有案例
let classifyAll = [];
// 回想人物志下的所有人物信息
let characterAll = [];

!async function getData() {
    initEvent();

    const a = await AjaxRequest('carouselGroup/getAllCarouselGroup');
    carouselGroupAll = [...a.rows];

    const b = await AjaxRequest('classify/getById', 39);
    let classifySort = b.w_cases.sort((a, b) => a.characterId - b.characterId);
    classifyAll = [...classifySort];

    const c = await AjaxRequest('character/getAll');
    let d = c.filter((item) => {
        return classifyAll.find(prop => {
            return prop.characterId == item.id;
        })
    })
    d.forEach((item, index) => {
        characterAll.push({ ...classifyAll[index], ...item });
    })
    load();
}()

function load() {
    // WOW 自定义配置项
    const wow = new WOW({
        boxClass: 'wow',
        // 默认使用的是animated
        animateClass: 'animated',
        // 设置元素出发动画的偏移量，即元素的顶部距离浏览器底部多少距离出发动画
        offset: 200,
        // 是否在移动端使用 wow
        mobile: true,
        // 是否不断检测页面上新的 wow 元素
        live: true
    })
    wow.init();

    const businessBlock = document.querySelector('.businessBlock');
    const thisAntBlock = document.querySelector('.thisAntBlock');
    const welfareBlock = document.querySelector('.welfareBlock');
    const dreamsBlock = document.querySelector('.dreamsBlock');
    const preIntroduce = document.querySelector('.preIntroduce');
    const spaceBlock = document.querySelector('.spaceBlock');

    let businessData = [];
    let thisAntData = [];
    let welfareData = [];
    let dreamsData = [];
    // let preIntroduceData = [];
    let spaceData = [];

    const observer = new IntersectionObserver(entries => {
        entries.forEach((item) => {
            if (item.isIntersecting) {
                switch (item.target.className) {
                    case "businessBlock":
                        const data1 = carouselGroupAll[0].w_carousels;
                        // 合并数据
                        data1.forEach((item, index) => {
                            businessData.push({ ...homeData.businessBlock[index], ...item });
                        })
                        // 操作
                        const businessRender = new HomeRenderFn(businessBlock, businessData);
                        businessRender.businessFn();

                        observer.unobserve(item.target);
                        break;

                    case "thisAntBlock":
                        const data2 = carouselGroupAll[1].w_carousels;

                        // 合并数据
                        data2.forEach((item, index) => {
                            thisAntData.push({ ...homeData.thisAntBlock[index], ...item });
                        })

                        const thisAntRender = new HomeRenderFn(thisAntBlock, thisAntData);
                        thisAntRender.thisAntFn();

                        observer.unobserve(item.target);
                        break;

                    case "welfareBlock":
                        const data3 = carouselGroupAll[2].w_carousels;

                        // 合并数据
                        data3.forEach((item, index) => {
                            welfareData.push({ ...homeData.welfareBlock[index], ...item });
                        })

                        const welfareRender = new HomeRenderFn(welfareBlock, welfareData);
                        welfareRender.welfareFn();

                        observer.unobserve(item.target);
                        break;

                    case "dreamsBlock":
                        const data4 = carouselGroupAll[3].w_carousels;

                        // 合并数据
                        dreamsData = [...data4, ...homeData.dreamsBlock];

                        const dreamsRender = new HomeRenderFn(dreamsBlock, dreamsData);
                        dreamsRender.dreamsFn();

                        observer.unobserve(item.target);
                        break;

                    case "preIntroduce":
                        const preRender = new HomeRenderFn(preIntroduce, characterAll);
                        preRender.preIntroduceFn();

                        observer.unobserve(item.target);
                        break;

                    case "spaceBlock":
                        const data6 = carouselGroupAll;
                        //   console.log(' ', data6.slice(4,8))
                        let num = 0;
                        for (let i = 4; i <= 7; i++) {
                            spaceData.push({ ...data6[i], ...homeData.spaceBlock[num++] });
                        }

                        const render = new HomeRenderFn(spaceBlock, spaceData);
                        render.spaceFn();

                        observer.unobserve(item.target);
                        break;
                }
            }
        })
    }, {
        // 触发“交叉”的偏移量， 100px 20px 50px 40px（上右下左）
        rootMargin: '0px 0px 100px 0px',
    });
    // 添加观察元素
    observer.observe(businessBlock);
    observer.observe(thisAntBlock);
    observer.observe(welfareBlock);
    observer.observe(dreamsBlock);
    observer.observe(preIntroduce);
    observer.observe(spaceBlock);
}

// window.onload = initEvent;